<template>
  <div class="inout-apply">
    <div class="inout-apply-header">
      <el-radio-group v-model="radio1" @change="requestData">
        <el-radio-button label="返回申请"></el-radio-button>
        <el-radio-button label="外出申请"></el-radio-button>
      </el-radio-group>
    </div>
    <table-list
      :toTableData="tableData"
      :tableHeader="tableHeader"
      :deleteEdit="deleteEdit"
      :btn1="btn1"
      :btn2="btn2"
      @btn1="handlNoAllow"
      @btn2="handlAllow"
    ></table-list>
    <!-- <div class="inout-apply-table">
      <table-list
        :toTableData="tableData"
        :tableHeader="tableHeader"
        :deleteEdit="deleteEdit"
        :btn1="btn1"
        :btn2="btn2"
      ></table-list>
    </div> -->

    <!-- <el-alert title="成功提示的文案" type="success"> </el-alert> -->
  </div>
</template>

<script>
import { request } from "@/network/request.js";
import TableList from "@/components/common/TableList.vue";

export default {
  name: "vueName",
  data() {
    return {
      radio1: "返回申请",
      tableHeader: [
        { prop: "name", label: "姓名" },
        { prop: "phone", label: "电话" },
        { prop: "trans", label: "交通工具" },
        { prop: "now_address", label: "目前位置" },
        { prop: "way", label: "途径路径" },
        { prop: "go_time", label: "出发时间" },
        { prop: "arrive_time", label: "到达时间" },
      ],
      tableData: [], //传递给子组件数据
      deleteEdit: {
        options: 1,
        delete: 1,
        edit: 1,
      },
      btn1: "不通过",
      btn2: "通过",
    };
  },
  components: {
    TableList,
  },
  created() {
    this.requestData();
  },

  methods: {
    requestData() {
      console.log("555");
      return new Promise((resove, reject) => {
        if (this.radio1 == "外出申请") {
          this.tableHeader = [
            { prop: "name", label: "姓名" },
            { prop: "phone", label: "电话" },
            { prop: "trans", label: "交通工具" },
            { prop: "dest", label: "目的地" },
            { prop: "time", label: "出发时间" },
          ];
          request({
            url: "/b-go-out-go",
          }).then((res) => {
            this.tableData = res.data.data.sort((a, b) => {
              return a.id < b.id ? 1 : -1;
            });
            this.tableData = this.tableData.filter((s) => {
              return s.state == 0;
            });
            resove();
          });
        } else if (this.radio1 == "返回申请") {
          this.tableHeader = [
            { prop: "name", label: "姓名" },
            { prop: "phone", label: "电话" },
            { prop: "trans", label: "交通工具" },
            { prop: "now_address", label: "目前位置" },
            { prop: "way", label: "途径路径" },
            { prop: "go_time", label: "出发时间" },
            { prop: "arrive_time", label: "到达时间" },
          ];
          request({
            url: "/b-go-out-out",
          }).then((res) => {
            this.tableData = res.data.data.sort((a, b) => {
              return a.id < b.id ? 1 : -1;
            });
            this.tableData = this.tableData.filter((s) => {
              return s.state == 0;
            });
            resove();
          });
        }
      });
    },
    handlAllow(row) {
      console.log(row);
      if (this.radio1 == "外出申请") {
        request({
          method: "post",
          url: "/change_go_out_go",
          data: {
            id: row.id,
            openid: row.openid,
            state: "1",
          },
        })
          .then((res) => {
            console.log(res);
            this.requestData();
          })
          .catch((err) => {
            console.log(err);
          });
      }
      if (this.radio1 == "返回申请") {
        request({
          method: "post",
          url: "/change_go_out_out",
          data: {
            id: row.id,
            openid: row.openid,
            state: "1",
          },
        })
          .then((res) => {
            console.log(res);
            this.requestData();
          })
          .catch((err) => {
            console.log(err);
          });
      }
    },
    handlNoAllow(row) {
      if (this.radio1 == "外出申请") {
        request({
          method: "post",
          url: "/change_go_out_go",
          data: {
            id: row.id,
            openid: row.openid,
            state: "-1",
          },
        })
          .then((res) => {
            console.log(res);
            this.requestData();
          })
          .catch((err) => {
            console.log(err);
          });
      }
      if (this.radio1 == "返回申请") {
        request({
          method: "post",
          url: "/change_go_out_out",
          data: {
            id: row.id,
            openid: row.openid,
            state: "-1",
          },
        })
          .then((res) => {
            console.log(res);
            this.requestData();
          })
          .catch((err) => {
            console.log(err);
          });
      }
      // this.$confirm("此操作将永久删除该用户, 是否继续?", "提示", {
      //   confirmButtonText: "确定",
      //   cancelButtonText: "取消",
      //   type: "warning",
      // })
      //   .then(() => {
      //     this.$message({
      //       type: "success",
      //       message: "删除成功!",
      //     });
      //     request({
      //       method: "post",
      //       url: "/delete_all_needpay", //传入confing,在baseURL后面的值
      //       data: {
      //         openid: row.openid,
      //       },
      //     })
      //       .then((res) => {
      //         this.requestData();
      //       })
      //       .catch((err) => {
      //         console.log(err);
      //       });
      //   })
      //   .catch(() => {
      //     this.$message({
      //       type: "info",
      //       message: "已取消删除",
      //     });
      //   });
    },
  },
};
</script>

<style lang="scss">
@import "@/assets/styles/global.scss";
.inout-apply {
  box-sizing: border-box;
  // margin: 20px;
  width: 100%;
  // height: 100%;
  // padding: 20px;、
  .inout-apply-header {
    padding: 20px 20px 0 20px;
    box-sizing: border-box;
  }
  // .inout-apply-table {
  //   // height: 100%;
  //   // background-color: #ffffff;
  //   // padding: 0 10px;
  //   // padding: 20px;
  //   box-sizing: border-box;
  //   // overflow: scroll;
  //   // overflow-y: scroll;
  //   .pagination {
  //     padding-top: 10px;
  //     padding-bottom: 100px;
  //     display: flex;
  //     @include right;
  //     background-color: #ffffff;
  //   }
  // }
}
</style>
